/* 主题基础变量 - 避免重复定义 */
@use "../base/variables" as *;

// 通用 CSS 变量映射（所有主题共享）
@mixin theme-variables {
  /* ===== 间距变量 ===== */
  --spacing-xs: #{$spacing-xs};
  --spacing-sm: #{$spacing-sm};
  --spacing-base: #{$spacing-base};
  --spacing-md: #{$spacing-md};
  --spacing-lg: #{$spacing-lg};
  --spacing-xl: #{$spacing-xl};
  --spacing-2xl: #{$spacing-2xl};
  --spacing-3xl: #{$spacing-3xl};
  --spacing-4xl: #{$spacing-4xl};

  /* ===== 字体变量 ===== */
  --font-size-xs: #{$font-size-xs};
  --font-size-sm: #{$font-size-sm};
  --font-size-base: #{$font-size-base};
  --font-size-lg: #{$font-size-lg};
  --font-size-xl: #{$font-size-xl};
  --font-size-2xl: #{$font-size-2xl};
  --font-size-3xl: #{$font-size-3xl};

  --font-weight-light: #{$font-weight-light};
  --font-weight-normal: #{$font-weight-normal};
  --font-weight-medium: #{$font-weight-medium};
  --font-weight-semibold: #{$font-weight-semibold};
  --font-weight-bold: #{$font-weight-bold};

  /* ===== 圆角变量 ===== */
  --border-radius-xs: #{$border-radius-xs};
  --border-radius-sm: #{$border-radius-sm};
  --border-radius-base: #{$border-radius-base};
  --border-radius-md: #{$border-radius-md};
  --border-radius-lg: #{$border-radius-lg};
  --border-radius-xl: #{$border-radius-xl};
  --border-radius-2xl: #{$border-radius-2xl};
  --border-radius-full: #{$border-radius-full};

  /* ===== 过渡变量 ===== */
  --transition-fast: #{$transition-fast};
  --transition-base: #{$transition-base};
  --transition-slow: #{$transition-slow};

  /* ===== 层级变量 ===== */
  --z-index-dropdown: #{$z-index-dropdown};
  --z-index-sticky: #{$z-index-sticky};
  --z-index-fixed: #{$z-index-fixed};
  --z-index-modal-backdrop: #{$z-index-modal-backdrop};
  --z-index-modal: #{$z-index-modal};
  --z-index-popover: #{$z-index-popover};
  --z-index-tooltip: #{$z-index-tooltip};

  /* ===== 特殊效果 ===== */
  --backdrop-blur: blur(10px);
}

// 明亮主题颜色
@mixin light-theme-colors {
  /* ===== 颜色变量 ===== */
  --color-primary: #{$color-primary};
  --color-primary-light: #{$color-primary-light-3};
  --color-primary-lighter: #{$color-primary-light-8};
  --color-primary-dark: #{$color-primary-dark-1};

  --color-success: #{$color-success};
  --color-success-light: #{$color-success-light};
  --color-success-lighter: #{$color-success-extra-light};

  --color-warning: #{$color-warning};
  --color-warning-light: #{$color-warning-light};
  --color-warning-lighter: #{$color-warning-extra-light};

  --color-danger: #{$color-danger};
  --color-danger-light: #{$color-danger-light};
  --color-danger-lighter: #{$color-danger-extra-light};

  --color-info: #{$color-info};
  --color-info-light: #{$color-info-light};
  --color-info-lighter: #{$color-info-extra-light};

  /* ===== 文本颜色 ===== */
  --color-text-primary: #{$color-text-primary};
  --color-text-secondary: #{$color-text-secondary};
  --color-text-tertiary: #{$color-text-tertiary};
  --color-text-quaternary: #{$color-text-quaternary};
  --color-text-disabled: #{$color-text-disabled};
  --color-text-placeholder: #{$color-text-placeholder};
  --color-text-inverse: #{$bg-color-white};

  /* ===== 背景颜色 ===== */
  --color-bg-primary: #{$bg-color-white};
  --color-bg-secondary: #{$bg-color-container};
  --color-bg-tertiary: #{$bg-color-layout};
  --color-bg-quaternary: #{$bg-color-hover};
  --color-bg-hover: #{$bg-color-hover};
  --color-bg-active: #{$bg-color-active};
  --color-bg-disabled: #{$bg-color-disabled};
  --color-bg-mask: rgba(0, 0, 0, 0.5);

  /* ===== 边框颜色 ===== */
  --color-border-primary: #{$border-color-base};
  --color-border-secondary: #{$border-color-light};
  --color-border-tertiary: #{$border-color-lighter};
  --color-border-quaternary: #{$border-color-extra-light};

  /* ===== 阴影 ===== */
  --shadow-xs: #{$box-shadow-xs};
  --shadow-sm: #{$box-shadow-sm};
  --shadow-base: #{$box-shadow-base};
  --shadow-md: #{$box-shadow-md};
  --shadow-lg: #{$box-shadow-lg};
  --shadow-xl: #{$box-shadow-xl};

  /* ===== 渐变 ===== */
  --gradient-primary: linear-gradient(135deg, #{$color-primary}, #{$color-primary-dark-1});
  --gradient-success: linear-gradient(135deg, #{$color-success}, #{$color-success-light});
  --gradient-warning: linear-gradient(135deg, #{$color-warning}, #{$color-warning-light});
  --gradient-danger: linear-gradient(135deg, #{$color-danger}, #{$color-danger-light});
  --gradient-info: linear-gradient(135deg, #{$color-info}, #{$color-info-light});

  /* ===== 代码高亮 ===== */
  --code-bg: #f8f9fa;
  --code-text: #e83e8c;
  --code-keyword: #007bff;
  --code-string: #28a745;
  --code-comment: #6c757d;
  --code-number: #fd7e14;
  --code-function: #6f42c1;

  /* ===== 滚动条 ===== */
  --scrollbar-track: #{$bg-color-container};
  --scrollbar-thumb: #{$color-text-quaternary};
  --scrollbar-thumb-hover: #{$color-text-tertiary};

  /* ===== 代码编辑器专用变量 ===== */
  --editor-bg: #{$bg-color-white};
  --editor-header-bg: #f5f7fa;
  --editor-border: #ebeef5;
  --editor-gutter-bg: #fafafa;
  --editor-line-number: #909399;
  --editor-active-line: #f5f7fa;
  --editor-text: #{$color-text-primary};
}

// 暗色主题颜色 - 优化为更深的色调，接近参考图片效果
@mixin dark-theme-colors {
  /* ===== 颜色变量 ===== */
  --color-primary: #5b9cff;
  --color-primary-light: #7db3ff;
  --color-primary-lighter: rgba(91, 156, 255, 0.12);
  --color-primary-dark: #4285f4;

  --color-success: #52c41a;
  --color-success-light: #73d13d;
  --color-success-lighter: rgba(82, 196, 26, 0.12);

  --color-warning: #faad14;
  --color-warning-light: #ffc53d;
  --color-warning-lighter: rgba(250, 173, 20, 0.12);

  --color-danger: #ff4d4f;
  --color-danger-light: #ff7875;
  --color-danger-lighter: rgba(255, 77, 79, 0.12);

  --color-info: #1890ff;
  --color-info-light: #40a9ff;
  --color-info-lighter: rgba(24, 144, 255, 0.12);

  /* ===== 文本颜色 ===== */
  --color-text-primary: #ffffff;
  --color-text-secondary: #e8eaed;
  --color-text-tertiary: #bdc1c6;
  --color-text-quaternary: #9aa0a6;
  --color-text-disabled: #5f6368;
  --color-text-placeholder: #80868b;
  --color-text-inverse: #1a1f2e;

  /* ===== 背景颜色 - 更深的蓝灰色调 ===== */
  --color-bg-primary: #1e2139;
  --color-bg-secondary: #252945;
  --color-bg-tertiary: #1a1f2e;
  --color-bg-quaternary: #2c3154;
  --color-bg-hover: rgba(91, 156, 255, 0.08);
  --color-bg-active: rgba(91, 156, 255, 0.12);
  --color-bg-disabled: #252945;
  --color-bg-mask: rgba(26, 31, 46, 0.8);

  /* ===== 边框颜色 ===== */
  --color-border-primary: #3c4043;
  --color-border-secondary: #2c3154;
  --color-border-tertiary: #252945;
  --color-border-quaternary: #1e2139;

  /* ===== 阴影 - 更深的阴影效果 ===== */
  --shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
  --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.5), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
  --shadow-base: 0 4px 6px -1px rgba(0, 0, 0, 0.5), 0 2px 4px -1px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -2px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.6), 0 10px 10px -5px rgba(0, 0, 0, 0.4);
  --shadow-xl: 0 25px 50px -12px rgba(0, 0, 0, 0.7);

  /* ===== 渐变 ===== */
  --gradient-primary: linear-gradient(135deg, #5b9cff, #4285f4);
  --gradient-success: linear-gradient(135deg, #52c41a, #73d13d);
  --gradient-warning: linear-gradient(135deg, #faad14, #ffc53d);
  --gradient-danger: linear-gradient(135deg, #ff4d4f, #ff7875);
  --gradient-info: linear-gradient(135deg, #1890ff, #40a9ff);

  /* ===== 代码高亮 ===== */
  --code-bg: #252945;
  --code-text: #ff6b9d;
  --code-keyword: #5b9cff;
  --code-string: #52c41a;
  --code-comment: #9aa0a6;
  --code-number: #faad14;
  --code-function: #b37feb;

  /* ===== 滚动条 ===== */
  --scrollbar-track: #252945;
  --scrollbar-thumb: #3c4043;
  --scrollbar-thumb-hover: #5f6368;

  /* ===== 代码编辑器专用变量（暗色主题）===== */
  --editor-bg: #1e2139;
  --editor-header-bg: #252945;
  --editor-border: #2c3154;
  --editor-gutter-bg: #1a1f2e;
  --editor-line-number: #9aa0a6;
  --editor-active-line: rgba(91, 156, 255, 0.08);
  --editor-text: #e8eaed;
}